<template>
  <div>
    <a-upload
      v-model:file-list="files"
      v-bind="config"
      @change="handleChange"
      @success="handleSuccess"
      @error="handleError"
    />
  </div>
</template>

<script lang="ts">
  import { defineComponent, ref } from 'vue';

  export default defineComponent({
    props: {
      modelValue: {
        type: [Object, Array, String],
        default: '',
      },
      config: Object,
    },
    emits: ['update:modelValue'],
    setup: (props, ctx) => {
      const files: any = ref(props.modelValue);
      const handleChange = (list: any) => {
        files.value = list;
        ctx.emit('update:modelValue', list);
      };
      const handleSuccess = () => {
        ctx.emit('update:modelValue', files.value);
      };
      const handleError = () => {
        ctx.emit('update:modelValue', files.value);
      };

      return {
        files,
        handleChange,
        handleSuccess,
        handleError,
      };
    },
  });
</script>

<style></style>
